<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="icon" type="image/x-icon" href="http://mojinshi.com/propertyMS/angular/assets/images/logo.jpg">

  <title>邀请函</title>
  <style>
    * {
      padding: 0;
      margin: 0;
    }

    body,
    html {
      width: 100%;
      height: 100%;
      box-sizing: border-box;
    }

    #wrap {
      width: 100%;
      height: 100%;
      background: url(../images/inv.jpg);
      background-size: 100% 100%;
    }

    .title {
      padding: 30px 30px 10px 30px;
      padding-top: 110px;
    }

    .body {
      padding: 10px 30px 20px 30px;
      text-indent: 32px;
    }

    .info {
      padding: 10px 30px 30px 30px;
      font-size: 13px;
      color: #795548;
    }

    .img {
      width: calc(100% - 55px);
      height: 100px;
      margin: 0 auto;
    }

    .img>div {
      width: 49%;
      float: left;
      text-align: center;
    }

    .img>div>img {
      width: 100%;
    }

    .img>div:nth-child(1) {
      margin-right: 2%
    }
  </style>
</head>

<body>
  <div id="wrap">
    <div class="title">
      您好, <strong id="name">XXX</strong>:
    </div>
    <div class="body">
      我是 <strong id="location">XXXXXX</strong> 的业主，现诚邀您作为房屋“<strong id="type">XX</strong>”一起管理我们的房间。请扫描以下二维码下载
      IN社区APP 。
    </div>
    <div class="info">
      注意，请以<strong id="phone">XXXXXXXXXX</strong>注册登录，合作愉快！
    </div>
    <div class="img">
      <div>
        <img src="../images/inshequ-ios.png" alt="">
        <span>苹果手机下载</span>
      </div>
      <div>
        <img src="../images/inshequ-360.png" alt="">
        <span>安卓手机下载</span>
      </div>
    </div>
  </div>
</body>

</html>
<script>
function $(id){
  return document.getElementById(id)
}
  var url = decodeURI(window.location.search);
  //定义一个空对象
  var obj = {};
  url = url.split('?')
  url.forEach(element => {
    var a = element.split('=')
    obj[a[0]] = a[1]
  });
  $('name').innerHTML=obj.name
  $('location').innerHTML=obj.location
  $('type').innerHTML=obj.type
  $('phone').innerHTML=obj.phone.slice(0,11)
  console.log(obj);
</script>